<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('月报查询')"/>
    <th:block th:include="include :: datetimepicker-css"/>
    <style>
        .fixed-table-toolbar {
            display: none;
        }

        .tableFirstHeadTh {
            text-align: center;
             font-size:large; 
        }
       .tableSecondHeadTh {
       width:80px;
            /* text-align: center; */
           /*  word-break:break-all; 
            word-wrap:break-word */
        }

    </style>
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <form id="formId">
                <div class="select-list">
                    <ul>
                        <li>
                            选择年月：
                        </li>
                        <div class="col-xs-3">
                            <!-- 				 	<div class="input-group date">
                                                    <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                                                     <input type="text" class="form-control" id="month" name="month" required>
                                              </div> -->
                            <div class="input-group date">
                                <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                                <input type="text" class="form-control" id="month" name="month" placeholder="yyyy-MM">
                            </div>

                        </div>
                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm" onclick="searchMonth()"><i
                                    class="fa fa-search"></i>&nbsp;搜索</a>
                            <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i
                                    class="fa fa-refresh"></i>&nbsp;重置</a>
                            <a class="btn btn-primary btn-rounded btn-sm" onclick="exportExcel()"
                               shiro:hasPermission="system:hxDayReport:export">
                                <i class="fa fa-download"></i> 导出
                            </a>
                        </li>
                    </ul>
                </div>
            </form>
        </div>
        <div class="col-sm-12 select-table table-striped " id="monthCal">
            <table id="bootstrap-table" class="table table-bordered" style="width:4600px;" data-mobile-responsive="true" ></table>
        </div>
    </div>
</div>
<div th:include="include :: footer"></div>
<th:block th:include="include :: datetimepicker-js"/>
<script th:inline="javascript">

    var prefix = ctx + "system/hxDayReport";

    $(function () {
    	
    	$("#bootstrap-table").bootstrapTable({
    		singleSelect:true,
    		striped:true,
    		onClickRow:function(row,$element){
    		}
    	}) 
    	
    	
        $("#month").datetimepicker({
            maxView: 3,
            minView: 2,
            startView: 3,//开始视图层
            format: "yyyy-mm",
            autoclose: true
        });

        $.table.init();
        $('.bootstrap-table .no-records-found').addClass('hide');


        var currentMonth = getCurrentMonth();
        //  var resData = getReportData(currentMonth);
        // bulidTable(resData);

        $.ajax({
            type: "get",
            url: prefix + "/monthCal",
            data: {
                "month": currentMonth,
            },
            //async: false,
            success: function (data) {
            	var dataSize = data.list.length;
               if(dataSize>0){
	               bulidTable(data);
               }else{
            	   $('.bootstrap-table .no-records-found').addClass('show');
               }
            }
        });
/*         
    	$("#bootstrap-table").on('click-row.bs.table',function(row,$element){
    		setTimeout(function() {
    			alert(22222);
			},500);
    	}) */
    	

    });

    function exportExcel(){
    	var month = $('#month').val();
    	if(month==null || month ==''){
    		var res = getCurrentMonth().split('-');
    		month = res[0]+'-'+res[1];
    	}

            $.ajax({
                type: "get",
                url: prefix + "/exportMonthCal/"+month,
            /*     data: {
                    "month": currentMonth,
                }, */
                success: function (data) {
                	window.location.href = prefix + "/common/download?fileName="+data.msg+"&delete=" + true;
                }
            });
    }
    
    function searchMonth() {
    	$('.bootstrap-table').find('thead').html("");
    	$('.bootstrap-table').find('tbody').html("");
    	
        var month = $("#month").val();
        month += "-01";
        $.ajax({
            type: "get",
            url: prefix + "/monthCal",
            data: {
                "month": month,
            },
            //async: false,
            success: function (data) {
            	var dataSize = data.list.length;
                if(dataSize>0){
 	               bulidTable(data);
                }else{
             	   $('.bootstrap-table .no-records-found').addClass('show');
                }
            }
        });
    }

    /*     	function getReportData(month){
                var tableData = "";
                $.ajax({
                    type: "get",
                    url: prefix + "/monthCal",
                     data: {
                        "month": month,
                    },
                    async: false,
                    success: function(data) {
                        tableData = data;
                        return tableData;
                    }
                });
            } */

    function bulidTable(data) {
        var yfxmSize = data.yfxm.length;
        var zhxmSize = data.zhxm.length;
        var qtxmSize = data.qtxm.length;
        var listSize = data.list.length;
        var total=yfxmSize+zhxmSize+qtxmSize;
        var headColspanSize = total+8;
       // $('.bootstrap-table').find('thead').append('<tr style="height:100px;"><th colspan="4" rowspan="4"></th><th colspan="' + total + '">2019年7月研发中心人员工时汇总表</th></tr>');
        $('.bootstrap-table').find('thead').append('<tr style="height:50px;"><th colspan="4"></th><th  colspan="' + total + '" class="tableFirstHeadTh" style="background-color: orange;">开展项目投入工作量（天）</th><th class="tableFirstHeadTh" rowspan="3" colspan="7" style="background-color: #bfbcb7;">项目外投入工作量（天）</th><th colspan="2"></th><tr/>');
        $('.bootstrap-table').find('thead').append('<tr style="height:30px;"><th></th><th></th><th></th><th></th><th  colspan="' + yfxmSize + '" class="tableFirstHeadTh" style="background-color: orange;">研发项目</th><th  class="tableFirstHeadTh"  colspan="' + zhxmSize + '"  style="background-color: #32c8d0;">综合项目</th><th class="tableFirstHeadTh" colspan="' + qtxmSize + '" style="background-color: #bfbcb7;">其他项目</th><th class="tableFirstHeadTh" colspan="6" style="background-color: #bfbcb7;"></th><th class="tableFirstHeadTh" colspan="1" style="background-color: #bfbcb7;"></th><th class="tableFirstHeadTh" colspan="1" style="background-color: #bfbcb7;"></th><tr/>');
        var secondRowStr = '<tr><th style="width:70px;">姓名</th><th style="width:100px;">组别</th><th style="width:160px;">职位</th><th style="width:100px;">公司</th>';

        for (var i = 0; i < yfxmSize; i++) {
            secondRowStr += '<th class="tableSecondHeadTh" >' + data.yfxm[i].proname + '</th>';
        }
        for (var i = 0; i < zhxmSize; i++) {
            secondRowStr += '<th class="tableSecondHeadTh">' + data.zhxm[i].proname + '</th>';
        }
        for (var i = 0; i < qtxmSize; i++) {
            secondRowStr += '<th class="tableSecondHeadTh">' + data.qtxm[i].proname + '</th>';
        }
        secondRowStr += '<th class="tableSecondHeadTh">技术支持</th><th class="tableSecondHeadTh">工程变更</th><th class="tableSecondHeadTh">项目申报</th><th class="tableSecondHeadTh">商务合作</th><th class="tableSecondHeadTh">部门管理</th><th class="tableSecondHeadTh">其它</th><th class="tableSecondHeadTh">软件临时任务</th><th class="tableSecondHeadTh">工作量合计（天）</th><th class="tableSecondHeadTh">备注</th>';
        $('.bootstrap-table').find('tbody').append(secondRowStr + '</tr>');
        //var tbody = '';
        for (var i = 0; i < listSize; i++) {
            var map = data.list[i].map;
            var yfxm_pro_work = '';
			var zhxm_pro_work = '';
			var qtxm_pro_work = '';
            for (var j = 0; j < yfxmSize; j++) {
            	if(typeof(map[data.yfxm[j].proname]) == "undefined"){
					yfxm_pro_work += '<td>0</td>'
				}else{
					yfxm_pro_work += '<td>' + (map[data.yfxm[j].proname]/7.5).toFixed(1) + '</td>'
				}
            }
			for (var z = 0; z < zhxmSize; z++) {
				if(typeof(map[data.zhxm[z].proname]) == "undefined"){
					zhxm_pro_work += '<td>0</td>'
				}else{
					 
					zhxm_pro_work += '<td>' + (map[data.zhxm[z].proname]/7.5).toFixed(1) + '</td>'
				}
			}
			for (var q = 0; q < qtxmSize; q++) {
				if(typeof(map[data.qtxm[q].proname]) == "undefined"){
					qtxm_pro_work += '<td>0</td>'
				}else{
					qtxm_pro_work += '<td>' + (map[data.qtxm[q].proname]/7.5).toFixed(1) + '</td>'
				}
			}
            var tbody = '<tr id="' + data.list[i].userId + '"><td>' + data.list[i].userName + '</td><td>' + data.list[i].deptName + '</td><td>'+ data.list[i].position+'</td><td>' + data.list[i].gsName + '</td></tr>';
            $('.bootstrap-table').find('tbody').append(tbody);
            $('#' + data.list[i].userId).append(yfxm_pro_work);
			$('#' + data.list[i].userId).append(zhxm_pro_work);
			$('#' + data.list[i].userId).append(qtxm_pro_work);
			var total_time=map['total_work_time'];
			total_time = (total_time/7.5).toFixed(1);
            var other_pro = '<td>' + (data.list[i].other_pro1/7.5).toFixed(1) + '</td><td>' + (data.list[i].other_pro2/7.5).toFixed(1) + '</td><td>' + (data.list[i].other_pro3/7.5).toFixed(1) + '</td><td>' + (data.list[i].other_pro4/7.5).toFixed(1) + '</td><td>' + (data.list[i].other_pro5/7.5).toFixed(1) + '</td><td>' + (data.list[i].other_pro6/7.5).toFixed(1) + '</td><td>' + (data.list[i].other_pro7/7.5).toFixed(1) +'</td><td>' + total_time + '</td><td>' + data.list[i].remark + '</td>';
			$('#' + data.list[i].userId).append(other_pro);
			
        }
        //$('.bootstrap-table').find('tbody').append(tbody);


        //$('.bootstrap-table').find('tbody').append('<tr><td>黄辉平</td><td>工艺测试组</td><td>Java开发工程师</td><td>广州禾信</td><td>10</td><td>0</td><td>0</td><td>30</td><td>55</td><td>33</td><td>30</td><tr/>');
        //$('.bootstrap-table').find('tbody').append('<tr><td>刘浩忠</td><td>软件</td><td>高级应用开发工程师</td><td>广州禾信</td><td>10</td><td>0</td><td>0</td><td>30</td><td>55</td><td>33</td><td>30</td><tr/>');

    }

    function getCurrentMonth() {
        var res = "";
        var myDate = new Date();
        var currentYear = myDate.getFullYear();
        var currentMonth = myDate.getMonth() + 1; //获取当前月份(0-11,0代表1月)
        if (currentMonth < 10) {
            res = currentYear + "-0" + currentMonth + "-01";
        } else {
            res = currentYear + "-" + currentMonth + "-01";
        }
        return res;
    }

</script>
</body>
</html>